<template>
  <div class="menulist">
    <div class="menu" :class="{'active': item.menuCode == menuCode}" v-for="item in menuData" :key="item.menuCode" @click="changeMenu(item)">
      <div class="line" v-show="item.menuCode == menuCode"></div>
      <img class="icon" :src="item.menuIcon" />
      <div>{{ item.menuName }}</div>
    </div>
  </div>
</template>

<script>
import { querySystemMenuList } from '@/api/layout'
export default {
  name: 'test',
  data () {
    return {
      menuData: [],  //表格，二维数组
      menuCode: "", //当前菜单menuCode
    }
  },
  created () {
    this.init()
  },
  methods: {
    async init () {
      this.loading = true
      this.tableData = [];

      const {object} = await querySystemMenuList({
        systemCode: sessionStorage.getItem("systemCode")
      })

      this.menuData = object || [];
      if(this.menuData.length > 0) {
        this.menuCode = this.menuData[0].menuCode;
        this.$emit("getLayoutList", this.menuCode)
      }
    },

    changeMenu(item) {
      this.menuCode = item.menuCode;

      this.$emit("getLayoutList", this.menuCode)
    },

  }
}
</script>
<style lang="scss" scoped>
</style>
